<template>
  <div>
		<!-- <navbar title="车主信息" :disabled="true"></navbar> -->
         <van-cell-group style="position:relative;top:46px;">
            <img style="width:10rem;" src="../assets/u110.png" alt="">
                <!-- <van-field
                    v-model="licenseNo"
                    label="车牌号"
                    type="textarea"
                    placeholder="请输入车牌号"
                    rows="1"
                    autosize
                /> -->
                <!-- 驾驶证首发时间从上一个页面拿 -->
                <!-- 出生日期从身份证号上拿 -->
                <van-field
                    v-model="ownerName"
                    label="姓名"
                    type="textarea"
                    placeholder="请输入姓名"
                    rows="1"
                    autosize
                />
                <van-field
                    v-model="identifyNumber"
                    label="身份证号"
                    type="textarea"
                    placeholder="请输入身份证号"
                    rows="1"
                    autosize
                />
                  <van-field
                    v-model="mobilePhone"
                    label="手机号"
                    type="textarea"
                    placeholder="请输入手机号"
                    rows="1"
                    autosize
                />
                 <van-field
                    v-model="Address"
                    label="联系地址"
                    type="textarea"
                    placeholder="请输入联系地址"
                    rows="1"
                    autosize
                />
                	<van-cell>
                    <template slot="title">
                      <span class="van-cell-text">投保人</span>
                          <div class="swich">
                            <span>同车主</span>
                            <van-switch v-model="checked" size="20px"  />
                        </div>
                    </template>
                  </van-cell>
                  <div v-show="!checked">
                     <div style="padding:0.2rem ; color:#aaa; ">投保人信息:</div>
                       <van-field
                    v-model="insureName"
                    label="姓名"
                    type="textarea"
                    placeholder="请输入姓名"
                    rows="1"
                    autosize
                />
                <van-field
                    v-model="insureIdNum"
                    label="身份证号"
                    type="textarea"
                    placeholder="请输入身份证号"
                    rows="1"
                    autosize
                />
                  <van-field
                    v-model="insurePhone"
                    label="手机号"
                    type="textarea"
                    placeholder="请输入手机号"
                    rows="1"
                    autosize
                />
                 <van-field
                    v-model="insureAddress"
                    label="联系地址"
                    type="textarea"
                    placeholder="请输入联系地址"
                    rows="1"
                    autosize
                />
                  </div>
                  
                    	<van-cell>
                        <template slot="title">
                          <span class="van-cell-text">被投保人</span>
                                      
                          <div class="swich">
                              <span>同车主</span>
                              <van-switch v-model="checked2" size="20px" />
                          </div>
                        </template>
                      </van-cell>
                      <div v-show="!checked2">
                     <div style="padding:0.2rem ; color:#aaa; ">被投保人信息:</div>
                      <van-field
                    v-model="insuredName"
                    label="姓名"
                    type="textarea"
                    placeholder="请输入姓名"
                    rows="1"
                    autosize
                />
                <van-field
                    v-model="insuredIdNum"
                    label="身份证号"
                    type="textarea"
                    placeholder="请输入身份证号"
                    rows="1"
                    autosize
                />
                  <van-field
                    v-model="insuredPhone"
                    label="手机号"
                    type="textarea"
                    placeholder="请输入手机号"
                    rows="1"
                    autosize
                />
                 <van-field
                    v-model="insuredAddress"
                    label="联系地址"
                    type="textarea"
                    placeholder="请输入联系地址"
                    rows="1"
                    autosize
                />
                  </div>
                  
        </van-cell-group>
         <div class="btnCon"> 
          <van-button size="large" type="default" @click="toBao">下一步</van-button>
        </div>
  </div>
</template>

<script>
import navbar from "../components/navbar.vue";
import Vue from'vue'
import { Toast } from 'vant';

Vue.use(Toast);
export default {
  components: { navbar },
  data() {
    return {
       
      checked: true,
      checked2: true,
      value:'',

        //下一个页面需要 
        licenseDate:'',
        carModelId:'',
        frameNo:'',
        engineNo:'',
        cityCode:'',
        licenseNo:'',
        //
        ownerName:'',
        identifyNumber:'',
        mobilePhone:'',
        ownerBirthDay:'',
        Address:'',
        //投保人/被投保人
        insureName:'',
        insureIdNum:'',
        insurePhone:'',
        insureAddress:'',
        insureBirthday:'',

        insuredName:'',
        insuredIdNum:'',
        insuredPhone:'',
        insuredAddress:'',
        insuredBirthday:'',

    };
  },
  mounted(){
       if(this.$route.query.licenseDate){
          this.licenseDate = this.$route.query.licenseDate
      }
       if(this.$route.query.carModelId){
          this.carModelId = this.$route.query.carModelId
      }
        if(this.$route.query.frameNo){
          this.frameNo = this.$route.query.frameNo
      }
       if(this.$route.query.engineNo){
          this.engineNo = this.$route.query.engineNo
      }
       if(this.$route.query.Address){
          this.Address = this.$route.query.Address
      }
       if(this.$route.query.cityCode){
          this.cityCode = this.$route.query.cityCode
      }
        if(this.$route.query.licenseNo){
          this.licenseNo = this.$route.query.licenseNo
      } 
      if(this.$route.query.value){
          this.value = this.$route.query.value
      }
  },
  methods: {
    // changeTou:function(){
    //   console.log(this.checked)
      
    // },
      getBir:function(date){
         
          var birDate = date.substring(6,14)
          var year=birDate.substring(0,4)
          var mouth=birDate.substring(4,6)
          var day=birDate.substring(6,8)
          var birDate = year+'-'+mouth+'-'+day
          //  console.log(birDate)
          return birDate;
       
      },
      getIn:function(){
        if(this.checked == true){
          console.log(1)
          this.insureName = this.ownerName
          this.insureIdNum = this.identifyNumber
          this.insurePhone = this.mobilePhone
          this.insureAddress = this.Address
          this.insureBirthday = this.getBir(this.identifyNumber)
        }else{
            if(this.insureName == ''){
            Toast('请输入投保人姓名');
            return false
          }
            if(this.insureIdNum != ''){
              this.insureBirthday = this.getBir(this.insureIdNum)
          }else{
              Toast('请输入投保人身份证号');
              return false
          }
            if(this.insurePhone == ''){
            Toast('请输入投保人手机号');
            return false
          }
           if(this.insureAddress == ''){
            Toast('请输入投保人联系地址');
            return false
          }
        }
        console.log(this.insureName)
        console.log(this.insureIdNum)
        console.log(this.insurePhone)
        console.log(this.insureAddress)
        console.log(this.insureBirthday)
      },
      getInd:function(){
        if(this.checked2 == true){
          console.log(2)
          this.insuredName = this.ownerName
          this.insuredIdNum = this.identifyNumber
          this.insuredPhone = this.mobilePhone
          this.insuredAddress = this.Address
          this.insuredBirthday = this.getBir(this.identifyNumber)
        }else{
            if(this.insuredName == ''){
            Toast('请输入被投保人姓名');
            return false
          }
            if(this.insuredIdNum != ''){
              this.insureBirthday = this.getBir(this.insuredIdNum)
          }else{
              Toast('请输入被投保人身份证号');
              return false
          }
            if(this.insuredPhone == ''){
            Toast('请输入被投保人手机号');
            return false
          } 
           if(this.insuredAddress == ''){
            Toast('请输入被投保人联系地址');
            return false
          }
        }
        console.log(this.insuredName)
        console.log(this.insuredIdNum)
        console.log(this.insuredPhone)
        console.log(this.insuredAddress)
        console.log(this.insuredBirthday)
      },
      toBao:function(){

           
           if(this.ownerName == ''){
            Toast('请输入姓名');
            return
          }
            if(this.identifyNumber != ''){
              this.ownerBirthDay = this.getBir(this.identifyNumber)
              console.log( this.ownerBirthDay)
          }else{
              Toast('请输入身份证号');
              return
          }
            if(this.mobilePhone == ''){
            Toast('请输入手机号');
            return
          }
           if(this.Address == ''){
            Toast('请输入联系地址');
            return
          }
          
          // console.log()
          if(this.getIn() == false || this.getInd()== false){
            return
          }
         
            this.$router.push({
                name: "CarProgram",
                query: {
                    ownerName:this.ownerName,
                    identifyNumber:this.identifyNumber,
                    mobilePhone:this.mobilePhone,
                    ownerBirthDay:this.ownerBirthDay,
                    licenseDate:this.licenseDate,
                    carModelId:this.carModelId,
                    Address:this.Address,
                    frameNo:this.frameNo,
                     engineNo:this.engineNo,
                     cityCode:this.cityCode,
                     licenseNo:this.licenseNo,

                     insureName:this.insureName,
                      insureIdNum:this.insureIdNum,
                      insurePhone:this.insurePhone,
                      insureAddress:this.insureAddress,
                      insureBirthday:this.insureBirthday,

                      insuredName:this.insuredName,
                      insuredIdNum:this.insuredIdNum,
                      insuredPhone:this.insuredPhone,
                      insuredAddress:this.insuredAddress,
                      insuredBirthday:this.insuredBirthday,
                      value:this.value,
                }
            });
      }
  }
};
</script>
<style scoped lang="scss">
.swich {
  position: absolute;
  top: 0.27rem;
  right: 0.4rem;
  span{
    position: relative;
    top: -0.18rem;
    font-size: 0.3rem;
    color: rgba(0,0,0,0.5);
  }
}
 .btnCon{
    width: 6rem;
    margin: 2rem auto;
  }
</style>
